<%@ page language="java" import="java.util.*" pageEncoding="UTF-8" %>

<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/";
%>

<!DOCTYPE HTML>
<html>
<head>
    <base href="<%=basePath%>">
    <title>故事</title>
    <meta http-equiv="pragma" content="no-cache">
    <meta http-equiv="cache-control" content="no-cache">
    <meta http-equiv="expires" content="0">
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    <meta http-equiv="description" content="This is my page">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"/>
    <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>

    <!-- 加载CSS样式 -->
    <link href="css/ProductStoreAboutProduct_Css.css" rel="stylesheet" type="text/css" />
    <style>
        #storydesc ul{
            width: 100% !important;
            height: auto !important;
        }
        #storydesc ul li{
            width: 100% !important;
            height: auto !important;
        }
        #storydesc ul li p{
            width: 100% !important;
            height: auto !important;
        }
        #storydesc p{
            width: 100% !important;
            height: auto !important;
        }
        #storydesc p img{
            width: 100% !important;
            height: auto !important;
        }
        #storydesc p iframe {
            width: 100% !important;
            height: auto !important;
        }
    </style>
    <!-- 引用js -->
    <script type="text/javascript" src="js/jquery.js"></script>
    <script type="text/javascript" src="js/public.js"></script>
    <script type="text/javascript" src="js/story_shop_info.js"></script>
    <script>
        $(function() {
            // 监听滚动事件

            $(window).scroll(function() {
                // 获得div的高度
                var height = $(window).height();
                var h = $("#buy").offset().top;
                if($(this).scrollTop() >= h - height && $(this).scrollTop() < h) {
                    // 滚动到指定位置
                    $("#want").hide();

                } else {
                    $("#want").show();
                }
            });

        })
    </script>
</head>

<body>
<jsp:include page="/public.jsp"/>
<input type="hidden" value="<%=request.getParameter("storyid")%>" id="storyid" name="storyid"/>
<input type="hidden" value="<%=request.getParameter("shopid")%>" id="shopid" name="shopid"/>
<!-- 固定的title 样式 -->
<%--<header class="header">--%>
    <%--<div align="left" class="a">--%>
        <%--<img src="img/arrow_eft_circle.png" style="padding: 10px;height: 28px; width: 28px;" onclick="window.history.back(-1);" />--%>
    <%--</div>--%>

    <%--<div align="center" class="a">--%>
        <%--<span style="padding: 15px;font-size: 20px;color: white;">故事</span>--%>
    <%--</div>--%>

    <%--<div align="right" class="a">--%>
        <%--<img src="img/more.png" style="padding: 10px;height: 28px;width: 28px;" />--%>
    <%--</div>--%>
<%--</header>--%>

<!-- 这是一张固定的图片  非banner  是否可以点击  更换  有待商榷 -->
<%--<img src="img/DSC_1476.jpg" id="storylogo" onerror="imgerror(this, 'img/onerror.png');" class="img_style"/>--%>

<%--这里我给定一个div布局 让他去加载图片--%>
<div id="storylogo" ></div>


<span class="store_name" id="storyname">标题</span>
<span class="user_name" id="username">作者名</span>

<div style="width: 92%;margin: 10px; text-align: center;line-height: 50px;">

    <div style="width: 100%;text-align: center;line-height: 50px; height: 50px; margin-top: 10px;text-align: center;display: none">
        <span style="display: inline-block;border-top: 1px solid #ccc;width: 50px;height: 4px;"></span>
        <span style="padding: 5px;font-size: 16px;">产品故事名称</span>
        <span style="display: inline-block;border-top: 1px solid #ccc;width: 50px;height: 4px;"></span>
    </div>
</div>
</div>

<!-- 加载Item -->
<span  id="storydesc" class="item_span_desc"></span>

<!-- 加载想要按钮 -->
<div class="div_bottom_want">
    <img id="want" src="img/want.png" style="height: 30px;" onclick="location.href='/except/files/shop/shopinfo.jsp?shopid=<%=request.getParameter("shopid")%>'"/>
</div>

<!-- 立即购买 -->
    <div id="buy" class="buy_bg" onclick="location.href='/except/files/shop/shopinfo.jsp?shopid=<%=request.getParameter("shopid")%>'">
        <span>立即购买</span>
    </div>

<!-- END -->
<div style="width: 100%;text-align: center;line-height: 50px;background-color: #EBEBEB;">
    <span style="display: inline-block;border-top: 1px solid #ccc;width: 50px;height: 4px;"></span>
    <span class="ends">END</span>
    <span style="display: inline-block;border-top: 1px solid #ccc;width: 50px;height: 4px;"></span>
</div>


<span id="evaluate"></span>

<%--<div class="search_more" onclick="look_more();" id="evaluatemore" style="display: none;">--%>
    <%--<span>查看更多</span>--%>
<%--</div>--%>

<div id="evaluatemore" style="text-align: center; line-height: 50px; height: 50px;width: 100%;display: none;" onclick="look_more();">
    <span style="color: #999999;font-size: 15px;">查看更多</span>
</div>

<!-- 暂无更多-->
<%--<div class="search_more clearboth" id="nullmore">--%>
    <%--<span style="text-align: center;float: left;color: #999999;">暂无更多</span>--%>
<%--</div>--%>
<div id="nullmore" style="text-align: center; line-height: 50px; height: 50px;width: 100%;display: none;">
    <span style="color: #999999;font-size: 15px;">暂无更多</span>
</div>


<!-- 留言框输入 -->
<div class="div_bottom" >
    <hr style="height: 1px; width: 100%; float: right; background-color: #f4f4f4; border: none;" />
    <hr style="margin-bottom: 6px;" />
    <input placeholder="精选留言" id="evaluatetext"/>
    <span onclick="sendEvaluate();">发送</span>
</div>
<jsp:include page="/files/public_hint.jsp"/>
</body>
</html>